<template>
	<view style="display: inline-block;">
		<view>
			{{isbool(user)?user.name:placeholder}}
		</view>
		<view class="cover bcf" style="overflow-y: auto;z-index: 99999;height: 100vh;background-color: #EEE;" v-show="showStatus">
			<mescroll-uni ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" :up="upOption" @up="upCallback"
			 @emptyclick="emptyClick">
				<cu-custom  bgColor="bg-gradual-blue">
					<view slot="content">职工选择列表</view>
				</cu-custom>
				<view class="bcf padlr3 padtb2 bdtso flrc">
					<view class="marr2 pos-r">
						<view @tap.stop="showStatus=!showStatus" class="cu-btn round"><text class="cuIcon cuIcon-close"></text><ripple></ripple></view>
					</view>
					<view class="flex1">
						<search class="fs8 tac" placeholder=" 姓名 \ 手机号称 " v-model="search" @search="doSearch()"></search>
					</view>
				</view>
				<view class="padlr3">
					<view class="bcf pos-r mart3 pad2 round2 shadow" v-for="user in data" :key="user.id">
						<view class="pos-r" @tap.stop="selectUser(user)">
							<!-- <view class="pos-r"> -->
							<user-item :item="user"></user-item>
							<ripple></ripple>
						</view>
					</view>
				</view>
				<!-- <loading :loading="myIsLoading"></loading> -->
			</mescroll-uni>
		</view>

	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import MyMixin from '../../mixin/mixin.js'
	import List from '../../assets/js/list.js'

	import userItem from '../../templete/machine/user_item.vue'

	export default {
		name: 'user-selector',
		mixins: [MescrollMixin, MyMixin],
		components: {
			userItem
		},
		props: {

			value: {
				default: ""
			},
			placeholder: {
				type: String,
				default: "请选择"
			},

			show: ''
		},
		data() {
			let list = new List()
			return {
				list,
				where: {
					eq: {
						status: '',
						emergency: '',
						level: '',
					}
				},
				search: "",
				data: [],
				user: {},
				showStatus: false
			}
		},
		methods: {
			reload() {
				// this.showLoading()
				this.list.setData({
					_order: {
						id: "DESC"
					},
					_where: this.where,
					_search: this.search
				}).reload()
			},
			doSearch() {
				// this.showLoading()
				this.list.setData({
					_order: {
						id: "DESC"
					},
					_where: this.where,
					_search: this.search
				}).reload()
			},
			selectUser(user) {
				this.showStatus = false
				this.$emit('input', '/api_/machine_users/' + user.id, user)
				this.$emit('onSelect', '/api_/machine_users/' + user.id, user)
				this.user = user
			}
		},
		mounted() {
			this.list.initMescroll(this).setUrl('/api/machineUsers').setData({
				_order: {
					id: "DESC"
				},
				_where: this.where,
				_search: this.search,
			}).setCbFunc(res => {
				this.data = res
				this.myIsLoading = false
			}).reload()
		},
		watch: {
			value(curVal, oldVal) {
				if (this.$com.isbool(curVal)) {
					this.$api.res('machine_users', this.$com.iriId(curVal), res => {
						this.log(res)
						this.user = res
					})
				}
			},
			show(cur) {
				this.showStatus = this.isbool(cur)
			}
		}
	}
</script>

<style>

</style>
